<template>
    <div>
       <div class="ban"><img src="../assets/images/banner3.png" alt=""></div>
       <div class="tab">
           <ul id="ul">
               <li class="active"><router-link to="/compStr">公司介绍</router-link></li>
               <li><router-link to="/compStr/compQual">公司资质</router-link></li>
               <li><router-link to="/compStr/contactUs">联系我们</router-link></li>
           </ul>
           
       </div>
       <router-view></router-view>
    </div>
</template>
<script>
export default {
    mounted(){
        var lis=ul.children
        
        for(let i=0;i<lis.length;i++){
            lis[i].onclick=function(){
                for(var j=0;j<lis.length;j++){
                    lis[j].className=""
                }
                 this.className="active"
            }
           
           
        }
    }
}
</script>
<style>
.ban{height:2.5rem;width:100%}
.ban img{width:100%}
.tab{height:1rem;width:100%;background: #efefef;}
.tab ul {display: flex}
.tab ul li{flex: 1;text-align: center;line-height: 1rem;font-size:0.3rem}
.active{border-bottom: 2px solid #49b44f}
</style>


